<template>
	<view class="content">
		<!-- <view class="boxTitle">
			小程序版本信息
		</view>
		<view class="boxContent">
			小程序
		</view> -->
		<view class="boxTitle">
			APP版本信息
		</view>
		<view class="boxContent">
			版本信息:{{versions}} 
		</view>
		<view class="boxContent">
			手机型号:{{model}}
		</view>
		<view class="boxTitle">
			websocket连接状态
		</view>
		<view class="boxContent" v-if='websocket_messages' v-for="(item,index) in websocket_messages"  :key='index'>
			{{item.content}}
		</view>
		<view class="boxTitle">
			websocket心跳检测
		</view>
		<view class="boxContent" v-if='websocket_heartbeat_messages' v-for="(item,index) in websocket_heartbeat_messages"  :key='index'>
				{{item.content}}
		</view>

	</view>
</template>

<script>
	import eonfox from '@/components/eonfox/eonfox.js';
	import fns from '@/components/eonfox/fns.js';
	import websocketObject from '@/components/eonfox/websocket.js';
	var ef = new eonfox();
	var websocket = new websocketObject();
	export default {
		data() {
			return {
				versions:'',//版本
				model:'',//手机型号
				websocket_messages:[],
				websocket_heartbeat_messages:[]
			}
		},
		onShow() {
			var _this = this;
			//变更时更新
			websocket.heartbeat_messages_change_function(function(){
				_this.websocket_heartbeat_messages = websocket.heartbeat_messages;
				//_this.change = !_this.change;
				console.log('websocket_heartbeat_messages 更新');
			});
			websocket.messages_change_function(function(){
				_this.websocket_messages= websocket.messages;
				//_this.change = !_this.change;
				console.log('websocket_messages 更新');
			});
			
			
			uni.getSystemInfo({
				 success: function (res) {
					 console.log(res)
					 _this.versions=res.system
					 _this.model=res.model
				 }
			})
		},
		methods: {
			
		}
	}
</script>

<style>
	.content{
		width: 98%;
		margin-left: 2%;
	}
	.boxTitle {
		width: 100%;
		height: 70upx;
		font-size: 32upx;
		display: flex;
		line-height: 70upx;
		background-color: #676769;
		color: #FFFFFF;
	}

	.boxContent {
		width: 100%;
		height: 60upx;
		color: #2973E3;
		font-size: 28upx;
		display: flex;
		background-color: #F8F8F8;
		border-bottom: 1upx #C8C7CC solid;
		line-height: 60upx;
	}
</style>
